﻿<link  rel="stylesheet" href="~/bootstrap-table/bootstrap-table.css" />
<link rel="stylesheet" href="~/lib/bs5/css/bootstrap.min.css"/>

<script src="~/lib/jquery/dist/jquery.min.js"> </script>
<script src="~/lib/bs5/js/bootstrap.min.js"></script>
<script  type="text/javascript" src="~/bootstrap-table/bootstrap-table.min.js"></script>
<script src="~/bootstrap-table/bootstrap-table-locale-all.min.js"></script>

<button class="btn btn-primary btn-sm">创建任务</button>

<table id="task_table">

</table>

<script type="text/javascript">
    $("#task_table").bootstrapTable({
        search: true,
        pagination: true,
        stickyHeader:true,
        locale:"zh-CN",
        virtualScroll:true,
        fixedColumns: true,
        fixedNumber: 9 ,
        classes: "table table-striped table-hover table-bordered table- responsive",
        url: "/task/GetJobs",
        columns: [
            {
                title: '序号',
                field: 'no',
                align: 'center',
                width: 100,
                formatter: function (value, row, index) {
                    // var pageSize = $('#task_table').bootstrapTable('getOptions').pageSize;     //通过table的#id 得到每页多少条
                    // var pageNumber = $('#task_table').bootstrapTable('getOptions').pageNumber; //通过table的#id 得到当前第几页
                    // return pageSize * (pageNumber - 1) + index + 1;    // 返回每条的序号： 每页条数 *（当前页 - 1 ）+ 序号
                    return index + 1;
                }
            },
            {
                sortable: true,
                title: '作业名称',

                field: 'taskName'
            },
            {
                sortable:true,
                title: '分组',
                width: 240,
                field: 'groupName'
            },
            {
                title: '开始时间',
                width: 240,
                field: 'startTime'
            },
            {
                title: '间隔',
                width: 80,
                field: 'interval'
            }, {
                title: '状态',
                width: 80,
                field: 'status'
            }, {
                title: '描述',
                width: 240,
                field: 'describe'
            }, {
                title: '请求地址',
                width: 240,
                field: 'apiUrl'
            },  {
                title: '请求方式',
                width: 50,
                field: 'requestType'
            }, {
                title: '操作',
                field: 'id',
                width: 240,
                formatter: function (value, row, index) { 
                    var html_str = "<button class='btn btn-outline-primary btn-sm'    style=  'margin-right:8px;'>编辑 </button>";
                  
                    html_str += "<button class='btn btn-outline-primary btn-sm' style=  'margin-right:8px;'>执行 </button>";
                    html_str += "<button class='btn btn-outline-danger btn-sm' style=  'margin-right:8px;'>删除 </button>";
                    html_str += "<button class='btn btn-outline-secondary btn-sm' style=  'margin-right:8px;'>日志 </button>";
                    return html_str;
                }
            }
        ]
    })
</script>